import { BasicColumn, FormSchema } from '@/components/Table';
import { Tag } from 'ant-design-vue';

export const columns: BasicColumn[] = [
  {
    title: '角色ID',
    dataIndex: 'id',
    width: 80,
  },
  {
    title: '角色名称',
    dataIndex: 'role',
  },
  {
    title: '人数',
    dataIndex: 'num',
    width: 120,
  },
  {
    title: '描述',
    dataIndex: 'desc',
  },
  {
    title: '最近登录时间',
    dataIndex: 'update_time',
    width: 200,
  },
  {
    title: '操作者',
    dataIndex: 'operator',
  },
  {
    title: '状态',
    dataIndex: 'status',
    width: 120,
    customRender: ({ text }) => {
      if (text === 1) {
        return <Tag color="green">启用</Tag>;
      } else if (text === 0) {
        return <Tag color="red">停用</Tag>;
      } else {
        return <Tag color="blue">未知</Tag>;
      }
    },
  },
];

export const searchFormSchema: FormSchema[] = [
  {
    field: 'role',
    label: '角色名称',
    component: 'Input',
  },
  {
    field: 'status',
    label: '状态',
    component: 'Select',
    componentProps: {
      options: [
        { label: '启用', value: '1' },
        { label: '停用', value: '0' },
      ],
    },
  },
];

export const formSchema: FormSchema[] = [
  {
    field: 'id',
    label: '角色ID',
    component: 'Input',
    show: false,
  },
  {
    field: 'role',
    label: '角色名称',
    required: true,
    component: 'Input',
    componentProps: {
      maxlength: 10,
    },
  },
  {
    field: 'desc',
    label: '描述',
    component: 'InputTextArea',
    componentProps: {
      rows: 4,
      showCount: true,
      maxlength: 200,
    },
  },
  {
    field: 'status',
    label: '状态',
    component: 'RadioButtonGroup',
    defaultValue: 1,
    componentProps: {
      options: [
        { label: '启用', value: 1 },
        { label: '停用', value: 0 },
      ],
    },
  },
  {
    label: ' ',
    field: 'menu',
    slot: 'menu',
    component: 'Input',
  },
];
